<template>
	<view class="container">
		<view class="header">
			<image class="bg" mode="aspectFill" :src="url+'/static/imgs/mine/bg.png'"></image>
			<view class=" header-main">
				<view class="integral_goback auto-left" @click="toGoBack">返回首页</view>
				<view class="row padding">
					<view class="avatar-image">
					<image :src="userInfo.avatar" mode="aspectFill" ></image>
					</view>
					<view class="col info">
						<text>{{userInfo.nickname||''}}</text>
						<text>{{userInfo.phone||''}}</text>
					</view>
					
					<view class="integral auto-left" @click="toIntegralLog">{{userInfo.integral||0}}积分</view>
				</view>
			</view>
		</view>
		<view class="col menu">
			<view class="row item" @click="toOrderList">
				<image class="icon" :src="url+'/static/imgs/mine/date.png'"></image>
				<text class="name">我的订单</text>
				<view class="row auto-left right">
					<text class="number" v-if="orderNum>0">{{orderNum}}</text>
					<image class="more" :src="url+'/static/imgs/more-black.png'"></image>
				</view>
			</view>
			<view class="border"></view>
			<view class="row item" @click="toNamingList">
				<image class="icon" :src="url+'/static/imgs/mine/vip.png'"></image>
				<text class="name">我的冠名</text>
				<view class="row auto-left right">
					<text class="circle" v-if="namingCount>0"></text>
					<image class="more" :src="url+'/static/imgs/more-black.png'"></image>
				</view>
			</view>
			<view class="border"></view>
			<view class="row item" @click="toPlayTourList">
				<image class="icon" :src="url+'/static/imgs/mine/card.png'"></image>
				<text class="name">我的打赏</text>
				<view class="row auto-left right">
					<image class="more" :src="url+'/static/imgs/more-black.png'"></image>
				</view>
			</view>
		</view>
	</view>
</template>
<script>
	var app = getApp();
	import http from '../../../../common/js/request.js';
	import common from '../../../../common/js/function.js';
	export default {
		data() {
			return {
				url: app.globalData.baseImgUrl,
				store_id: app.globalData.storeId,
				userInfo: [], //用户信息
				orderNum: 0,
				namingCount: 0
			}
		},
		onShow() {
			var that = this;
			common.verifyAuth(() => {
				that._load();
			}, true);
		},
		methods: {
			_load() {
				var that = this;
				that.getUserInfo();
				that.getOrderNum();
				that.getNamingCount();
			},
			//返回首页
			toGoBack(){
				//app.globalData.storeId="";
				uni.removeStorageSync("timeLimit");
				app.globalData.giveGoodsInfo=""
				uni.reLaunch({
					url:"../../../index/index"
				})
			},
			//用户信息
			getUserInfo() {
				var that = this;
				http.post('/api/v1/member/member_info', {}, res => {
					that.userInfo = res.datas;
				});
			},
			//订单数量
			getOrderNum() {
				var that = this;
				http.post('/api/v1/order/my_order_num', {
					store_id: that.store_id
				}, res => {
					that.orderNum = res.datas;
				});
			},
			//判断我的冠名角标
			getNamingCount() {
				var that = this;
				http.post('/api/v1/goods/my_if_have_goods_naming_last', {
					store_id: that.store_id
				}, res => {
					that.namingCount = res.datas;
				})
			},

			//跳转到我的订单
			toOrderList: function() {
				uni.navigateTo({
					url: '/pages/store/order/list/list'
				})
			},
			//跳转到我的冠名
			toNamingList: function() {
				uni.navigateTo({
					url: '/pages/store/mine/namingList/namingList'
				})
			},
			//跳转到我的打赏
			toPlayTourList: function() {
				uni.navigateTo({
					url: '/pages/store/mine/playTourList/playTourList'
				})
			},
			//跳转到积分明细
			toIntegralLog: function() {
				uni.navigateTo({
					url: '/pages/store/mine/integralLog/integralLog'
				})
			},
		}
	}
</script>
<style>
	.number,
	.circle {
		margin-right: 24rpx;
	}

	.number {
		height: 36rpx;
		border-radius: 18rpx;
		min-width: 36rpx;
		background: #ed3f14;
		border: 2rpx solid transparent;
		color: #fff;
		text-align: center;
		padding: 0 10rpx;
		font-size: 24rpx;
		white-space: nowrap;
		transform-origin: -10% center;
		z-index: 10;
		box-shadow: 0 0 0 2rpx #fff;
		box-sizing: border-box;
		text-rendering: optimizeLegibility;

	}

	.circle {
		width: 14rpx;
		height: 14rpx;
		border-radius: 50%;
		background: #ed3f14;
	}

	.border {
		height: 1rpx;
		width: 100%;
		background: #F2F2F2;
	}

	.item {
		height: 132rpx;
		align-items: center;
		justify-content: space-between;
		padding: 0rpx 34rpx;
	}

	.item .name {
		color: #333333;
		font-size: 30rpx;
		margin-left: 18rpx;
	}


	.icon {
		width: 32rpx;
		height: 32rpx;
	}

	.more {
		width: 20rpx;
		height: 30rpx;
	}

	.right {
		align-items: center;
	}

	.bg {
		width: 100%;
		height: 360rpx;
	}

	.header {
		position: relative;
	}

	.padding {
		margin: 56rpx 34rpx 0rpx 34rpx;
		align-items: center;
		justify-content: space-between;
		color: #fff;
		font-size: 30rpx;
		/* width: 100%; */
		height: 100%;
	}

	.info {
		margin-left: 24rpx;
	}

	.info text:nth-child(2) {
		margin-top: 10rpx;
	}

	.header-main {
		position: absolute;
		top: 0;
		left: 0;
		align-items: center;
		width: 100%;
		height: 125rpx;
	}

	.avatar-image {
		width: 125rpx;
		height: 125rpx;
		border-radius: 50%;
		overflow: hidden;
	}
	.avatar-image image{
		width: 100%;
		height: 100%;
		display: block;
	}

	.integral {
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 0rpx 24rpx;
		height: 56rpx;
		background: rgba(255, 255, 255, 0.2);
		border-radius: 25rpx;
	}
	.integral_goback{
		text-align: right;
		margin-right:57rpx;
		font-size: 28rpx;
		color: #fff;
	}
</style>
